<template>
	<div class="text-center" v-loading="data.mtloading">
		<el-form label-width="100px" :model="data.info_user">

			<el-form-item :label="$t('account.role.name') + ':'" prop="nickname" class="pr-8">
				<el-input v-model="data.info_user.nickname" :placeholder="$t('message.pleaseEnter')" disabled />
			</el-form-item>

			<el-form-item :label="$t('account.account.login') + ':'" prop="account" class="pr-8">
				<el-input v-model="data.info_user.account" :placeholder="$t('message.pleaseEnter')" disabled />
			</el-form-item>

			<el-form-item :label="$t('account.role.Role') + ':'" prop="role_id" class="pr-8">
				<el-select v-model="data.info_user.role_id" :placeholder="$t('message.pleaseSelect')" clearable multiple
					filterable @change="changeSelect">
					<el-option v-for="item in data.role_list" :key="item.value" :label="item.label"
						:value="item.value" />
				</el-select>
			</el-form-item>

			<el-form-item>
				<div class="w-9/12 text-center">
					<el-button type="primary" @click="submit">{{ $t('public.save') }}</el-button>
					<el-button @click="cancel">{{ $t('public.cancel') }}</el-button>
				</div>
			</el-form-item>

		</el-form>
	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import { getauthroleList, getmanagerroleList, } from '@/api/account';
let emit = defineEmits(['investigate'])
let props = defineProps({
	info: {
		type: Object,
		default: {}
	}
})

let data = reactive({
	mtloading: false, // 加载
	info_user: { // 主体信息
		nickname: '',
		account: '',
		manager_id: '',
		role_id: []
	},
	role_list: [], // 权限列表
	role_nal: [], // 权限列表原始数据
	delid: '', // 被删除的权限
	original: '', // 原始数据,
	selectArr: [],
})

// 获取主体信息
let getinfo = async () => {
	data.mtloading = true
	let info = props.info
	data.info_user.nickname = info.nickname
	data.info_user.account = info.account
	data.info_user.manager_id = info.manager_id
	data.role_list = []
	await getauthroleList().then(res => {
		if (res.state == 200) {
			for (let item of res.data) {
				data.role_list.push({
					label: item.role_id + ' - ' + item.name,
					value: item.role_id
				})
			}
		}
	})
	await getmanagerroleList({ manager_id: info.manager_id }).then(res => {
		if (res.state == 200) {
			data.info_user.role_id = []
			for (let item of res.data) {
				data.info_user.role_id.push(item.role_id)
			}
			data.original = data.info_user.role_id.toString()
			data.role_nal = res.data
		}
	}).catch(err => {
		console.log(err)
		data.original = [1, 2].toString()
		data.unData = true
	})

	data.mtloading = false
}
// 保存
let submit = () => {
	console.log(data.info_user.role_id)
	let arr = [] // 原始数据
	let delt = [] // 需要被删除的权限ID
	let original = []
	let obj = {
		info: {
			manager_id: data.info_user.manager_id,
			role_id: ''
		},
		del: ''
	}

	if (data.original != '') {
		original = data.original.split(',')
		for (let item of original) {
			arr.push(item * 1)
		}
	}

	let roleid = data.info_user.role_id // 新的数据

	// 筛选出被删除的数据
	if (arr.length != 0) {
		for (let item of arr) {
			let index = roleid.indexOf(item)
			if (index === -1) {
				for (let ime of data.role_nal) {
					if (ime.role_id == item) {
						delt.push(ime.mr_id)
					}
				}
			}
		}
	}

	// 清除重复的数据
	if (roleid.length != 0) {
		obj.info.role_id = (roleid.filter(item => arr.indexOf(item) == -1)).join(',')
	}
	obj.del = delt.join(',')
	emit('investigate', obj)
}

// 取消
let cancel = () => {
	emit('investigate', false)
}

getinfo()

</script>